/**
 * 1. 移除了 useHistory, 采用 新增的 useNavigate 替代
 *
 * 2. 新增了 useSearchParams, 用于获取 search 参数
 *
 * 3. 六版本中，state 传参的数据在不新开页面的情况是刷新是不会丢失的。
 *    但还是不建议使用 state 来作为传参方式
 *
 * 4. 新增了 useRoutes，可以使用 json 配置的方式来定义路由配置了
 */

import { Route, Routes, useRoutes } from "react-router-dom";
import Contact from "./pages/Contact";
import Home from "./pages/Home";
import About from "./pages/About";

export default function App() {
  const element = useRoutes([
    {
      path: "/",
      element: <Home />,
    },
    {
      path: "/about",
      element: <About />,
    },
    {
      path: "/contact",
      element: <Contact />,
    },
  ]);

  return (
    <div>
      <h1>App</h1>

      <hr />

      {/* <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/about" element={<About />} />
        <Route path="/contact" element={<Contact />} />
      </Routes> */}

      {element}
    </div>
  );
}
